<script setup lang="ts">
const { y } = useWindowScroll()
</script>

<template>
  <div grid="~ rows-[max-content_1fr]" h-full w-full font-sans transition duration-0 view-transition-app>
    <TheHeader :class="[y > 5 && 'shadow-md shadow-slate-800']" />
    <main id="scrollEl" relative mt-29 w-full of-x-hidden of-y-auto max-w-screen="2xl" ma px-4>
      <slot />
    </main>
    <TheFooter />
  </div>
  <CustomerService />
  <ClientOnly>
    <BackTop />
  </ClientOnly>
</template>
